<template>
  <div>
    <el-table :data="data" v-loading="loading" class="el-table-align-center" align="center">
      <template v-for="colConfig in colConfigs">
        <component
          v-if="colConfig.component"
          :is="colConfig.component"
          :col-config="colConfig">
        </component>
        <el-table-column v-else v-bind="colConfig"  align="center"></el-table-column>
      </template>
    </el-table>
    <!--<div class="pagination-contaimember-operate-auditner" v-if="needPage">-->
    <!--<el-pagination-->
    <!--background-->
    <!--@size-change="changeSize"-->
    <!--@current-change="changePage"-->
    <!--:current-page="cPagination.page"-->
    <!--:page-sizes="[10,20,30, 50]"-->
    <!--:page-size="cPagination.limit"-->
    <!--layout="total, sizes, prev, pager, next, jumper"-->
    <!--:total="cPagination.total">-->
    <!--</el-pagination>-->
    <!--</div>-->

  </div>
</template>

<script>
  export default {
    name: "c-table-display-with-pagination",
    props: {
      loading: {
        type: Boolean,
        default: false
      },
      data: {
        type: Array,
        default: function () {
          return [];
        }
      },
      colConfigs: {
        type: Array,
        default: function () {
          return [];
        }
      }
    },
    methods: {
    },
    data() {
      return {}
    },
  }
</script>

<style scoped>

</style>
